@{
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>来料检验管理</title>
    <link href="~/scripts/layui-v2.5.6/layui/css/layui.css" rel="stylesheet" />
    <script src="~/scripts/jquery-3.4.1.min.js"></script>
    <script src="~/scripts/layui-v2.5.6/layui/layui.js"></script>
    <style>
        body {
            margin: 0;
            padding: 20px;
            background: #f5f5f5;
            font-family: 'Microsoft YaHei', sans-serif;
        }
        .search-container {
            background: #fff;
            padding: 15px;
            margin-bottom: 10px;
            border-radius: 2px;
            box-shadow: 0 1px 2px 0 rgba(0,0,0,.05);
        }
        .table-container {
            background: #fff;
            border-radius: 2px;
            box-shadow: 0 1px 2px 0 rgba(0,0,0,.05);
        }
        .search-form .layui-form-item {
            margin-bottom: 15px;
        }
        .toolbar {
            padding: 15px;
            border-bottom: 1px solid #e6e6e6;
        }
        .status-tag {
            padding: 2px 8px;
            border-radius: 12px;
            font-size: 12px;
            color: white;
            display: inline-block;
        }
        .status-draft { background: #8c8c8c; }
        .status-confirmed { background: #1890ff; }
        .status-completed { background: #52c41a; }
        .layui-table-cell {
            height: auto;
            line-height: 28px;
        }
    </style>
</head>
<body>
    <div class="layui-container-fluid">
        <!-- 搜索条件区域 -->
        <div class="search-container">
            <form class="layui-form search-form" lay-filter="searchForm">
                <div class="layui-row layui-col-space15">
                    <div class="layui-col-md3">
                        <div class="layui-form-item">
                            <label class="layui-form-label">检验单编号</label>
                            <div class="layui-input-block">
                                <input type="text" name="incomingInspectionCode" placeholder="请输入来料检验单编号" class="layui-input">
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md3">
                        <div class="layui-form-item">
                            <label class="layui-form-label">供应商编码</label>
                            <div class="layui-input-block">
                                <input type="text" name="supplierCode" placeholder="请输入供应商编码" class="layui-input">
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md3">
                        <div class="layui-form-item">
                            <label class="layui-form-label">供应商名称</label>
                            <div class="layui-input-block">
                                <input type="text" name="incomingInspectionJName" placeholder="请输入供应商名称" class="layui-input">
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md3">
                        <div class="layui-form-item">
                            <label class="layui-form-label">供应商批次号</label>
                            <div class="layui-input-block">
                                <input type="text" name="batch" placeholder="请输入供应商批次号" class="layui-input">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-row layui-col-space15">
                    <div class="layui-col-md3">
                        <div class="layui-form-item">
                            <label class="layui-form-label">产品物料编码</label>
                            <div class="layui-input-block">
                                <input type="text" name="productCode" placeholder="请输入产品物料编码" class="layui-input">
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md3">
                        <div class="layui-form-item">
                            <label class="layui-form-label">产品物料名称</label>
                            <div class="layui-input-block">
                                <input type="text" name="productName" placeholder="请输入产品物料名称" class="layui-input">
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md3">
                        <div class="layui-form-item">
                            <label class="layui-form-label">检测结果</label>
                            <div class="layui-input-block">
                                <select name="testingResult">
                                    <option value="">请选择检测结果</option>
                                    <option value="检验通过">检验通过</option>
                                    <option value="检验不通过">检验不通过</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md3">
                        <div class="layui-form-item">
                            <label class="layui-form-label">来料日期</label>
                            <div class="layui-input-block">
                                <input type="text" name="incomingDateRange" placeholder="开始日期 - 结束日期" class="layui-input" id="incomingDateRange">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-row layui-col-space15">
                    <div class="layui-col-md3">
                        <div class="layui-form-item">
                            <label class="layui-form-label">检测日期</label>
                            <div class="layui-input-block">
                                <input type="text" name="testingDateRange" placeholder="开始日期 - 结束日期" class="layui-input" id="testingDateRange">
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md3">
                        <div class="layui-form-item">
                            <label class="layui-form-label">检测人员</label>
                            <div class="layui-input-block">
                                <input type="text" name="testingPerson" placeholder="请输入检测人员" class="layui-input">
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md6">
                        <div class="layui-form-item">
                            <div class="layui-input-block" style="text-align: right; margin-left: 0;">
                                <button type="button" class="layui-btn" lay-submit lay-filter="searchBtn">
                                    <i class="layui-icon layui-icon-search"></i> 搜索
                                </button>
                                <button type="reset" class="layui-btn layui-btn-primary">
                                    <i class="layui-icon layui-icon-refresh"></i> 重置
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>

        <!-- 数据表格区域 -->
        <div class="table-container">
            <!-- 工具栏 -->
            <div class="toolbar">
                <div class="layui-btn-group">
                    <button class="layui-btn layui-btn-sm" id="addBtn">
                        <i class="layui-icon layui-icon-add-1"></i> 新增
                    </button>
                    <button class="layui-btn layui-btn-sm layui-btn-normal" id="editBtn">
                        <i class="layui-icon layui-icon-edit"></i> 修改
                    </button>
                    <button class="layui-btn layui-btn-sm layui-btn-danger" id="deleteBtn">
                        <i class="layui-icon layui-icon-delete"></i> 删除
                    </button>
                    <button class="layui-btn layui-btn-sm layui-btn-warm" id="exportBtn">
                        <i class="layui-icon layui-icon-export"></i> 导出
                    </button>
                </div>
            </div>
            
            <!-- 数据表格 -->
            <table class="layui-hide" id="inspectionTable" lay-filter="inspectionTable"></table>
        </div>
    </div>

    <script>
        layui.use(['table', 'form', 'laydate', 'layer'], function() {
            var table = layui.table;
            var form = layui.form;
            var laydate = layui.laydate;
            var layer = layui.layer;

            // 日期范围选择器
            laydate.render({
                elem: '#incomingDateRange',
                type: 'date',
                range: true
            });

            laydate.render({
                elem: '#testingDateRange',
                type: 'date',
                range: true
            });

            // 初始化表格
            table.render({
                elem: '#inspectionTable',
                url: '/IncomingInspection/GetPagedList',
                method: 'POST',
                page: true,
                limits: [10, 20, 50, 100],
                limit: 10,
                loading: true,
                cellMinWidth: 80,
                cols: [[
                    {type: 'checkbox', fixed: 'left'},
                    {field: 'incomingInspectionCode', title: '来料检验单编号', width: 160, fixed: 'left'},
                    {field: 'incomingInspectionName', title: '来料检验单名称', width: 140},
                    {field: 'incomingInspectionJName', title: '供应商简称', width: 120},
                    {field: 'batch', title: '供应商批次号', width: 120},
                    {field: 'productCode', title: '产品物料编码', width: 140},
                    {field: 'productName', title: '产品物料名称', width: 140},
                    {field: 'receiveNum', title: '接收数量', width: 100, align: 'center'},
                    {field: 'testingNum', title: '检测数量', width: 100, align: 'center'},
                    {field: 'unqualifiedNum', title: '不合格数', width: 100, align: 'center'},
                    {field: 'testingResult', title: '检测结果', width: 120, align: 'center'},
                    {field: 'testingPerson', title: '检测人员', width: 100, align: 'center'},
                    {field: 'incomingDate', title: '来料日期', width: 120, templet: function(d) {
                        if (d.incomingDate) {
                            return layui.util.toDateString(new Date(d.incomingDate), 'yyyy-MM-dd');
                        }
                        return '';
                    }},
                    {field: 'testingDate', title: '检测日期', width: 120, templet: function(d) {
                        if (d.testingDate) {
                            return layui.util.toDateString(new Date(d.testingDate), 'yyyy-MM-dd');
                        }
                        return '';
                    }}
                ]],
                parseData: function(res) {
                    console.log('表格数据响应:', res);
                    if (res.success && res.data && res.data.listDate) {
                        return {
                            "code": 0,
                            "msg": "查询成功",
                            "count": res.data.listDate.length,
                            "data": res.data.listDate
                        };
                    } else {
                        console.error('数据加载失败:', res);
                        return {
                            "code": 1,
                            "msg": res.message || "数据加载失败",
                            "count": 0,
                            "data": []
                        };
                    }
                }
            });

            // 搜索按钮事件
            form.on('submit(searchBtn)', function(data) {
                var searchData = data.field;
                
                // 处理日期范围
                if (searchData.incomingDateRange) {
                    var incomingDateRange = searchData.incomingDateRange.split(' - ');
                    if (incomingDateRange.length === 2) {
                        searchData.incomingDateStart = incomingDateRange[0];
                        searchData.incomingDateEnd = incomingDateRange[1];
                    }
                }
                
                if (searchData.testingDateRange) {
                    var testingDateRange = searchData.testingDateRange.split(' - ');
                    if (testingDateRange.length === 2) {
                        searchData.testingDateStart = testingDateRange[0];
                        searchData.testingDateEnd = testingDateRange[1];
                    }
                }
                
                // 重新加载表格
                table.reload('inspectionTable', {
                    where: searchData,
                    page: {
                        curr: 1
                    }
                });
                return false;
            });

            // 新增按钮事件
            $('#addBtn').click(function() {
                openFormDialog('新增来料检验', '/IncomingInspection/Form?action=add');
            });

            // 修改按钮事件
            $('#editBtn').click(function() {
                var checkStatus = table.checkStatus('inspectionTable');
                var selectedData = checkStatus.data;
                
                if (selectedData.length === 0) {
                    layer.msg('请选择要修改的记录', {icon: 2});
                    return;
                }
                
                if (selectedData.length > 1) {
                    layer.msg('只能选择一条记录进行修改', {icon: 2});
                    return;
                }
                
                var id = selectedData[0].id;
                openFormDialog('修改来料检验', '/IncomingInspection/Form?action=edit&id=' + id);
            });

            // 删除按钮事件
            $('#deleteBtn').click(function() {
                var checkStatus = table.checkStatus('inspectionTable');
                var selectedData = checkStatus.data;
                
                if (selectedData.length === 0) {
                    layer.msg('请选择要删除的记录', {icon: 2});
                    return;
                }
                
                layer.confirm('确定要删除选中的记录吗？', {icon: 3, title: '提示'}, function(index) {
                    var ids = selectedData.map(function(item) {
                        return item.id;
                    });
                    
                    // 批量删除
                    deleteRecords(ids);
                    layer.close(index);
                });
            });

            // 打开表单弹窗
            function openFormDialog(title, url) {
                layer.open({
                    type: 2,
                    title: title,
                    shadeClose: false,
                    shade: 0.3,
                    maxmin: true,
                    area: ['900px', '600px'],
                    content: url,
                    success: function(layero, index) {
                        // 可以在这里添加iframe加载成功后的处理
                    },
                    end: function() {
                        // 关闭弹窗后刷新表格
                        table.reload('inspectionTable');
                    }
                });
            }

            // 删除记录
            function deleteRecords(ids) {
                // 如果只有一个ID，使用单个删除接口
                if (ids.length === 1) {
                    $.ajax({
                        url: '/IncomingInspection/Delete',
                        type: 'POST',
                        data: { id: ids[0] },
                        success: function(res) {
                            if (res.success) {
                                layer.msg('删除成功', {icon: 1});
                                table.reload('inspectionTable');
                            } else {
                                layer.msg(res.message || '删除失败', {icon: 2});
                            }
                        },
                        error: function() {
                            layer.msg('删除失败', {icon: 2});
                        }
                    });
                } else {
                    // 批量删除
                    $.ajax({
                        url: '/IncomingInspection/BatchDelete',
                        type: 'POST',
                        contentType: 'application/json',
                        data: JSON.stringify(ids),
                        success: function(res) {
                            if (res.success) {
                                layer.msg('批量删除成功', {icon: 1});
                                table.reload('inspectionTable');
                            } else {
                                layer.msg(res.message || '批量删除失败', {icon: 2});
                            }
                        },
                        error: function() {
                            layer.msg('批量删除失败', {icon: 2});
                        }
                    });
                }
            }

            // 导出按钮事件
            $('#exportBtn').click(function() {
                layer.msg('导出功能待实现', {icon: 2});
            });
        });
    </script>
</body>
</html> 